<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>text</title>
		<style>
			* {
				padding: 0;
				margin: 0;
			}
		</style>
	</head>

	<body>
		<canvas id="canvas" width="1200" height="1200"></canvas>

		<script type="text/javascript">
			function draw() {
				var canvas = document.getElementById('canvas')
				if (!canvas.getContext) return

				var ctx = canvas.getContext('2d')

				ctx.font = '100px sans-serif'
				// ctx.textAlign = "start";
				// ctx.textBaseline = "bottom";
				ctx.direction = 'ltr'
				ctx.fillText('天若有情', 10, 100) // 填充文字
				ctx.strokeText('天若有情', 10, 200) // 边框描绘
			}

			draw()
		</script>
	</body>
</html>
